<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>16.深拷贝多层次分析</title>
</head>

<body>
  <script>
    // 为什么不能用浅拷贝的方式复制对象中潜逃的对象?
    let obj = {
      name: '后盾人',
      user: {
        name: 'hdcms'
      }
    };
    let hd = {
      name: obj.name,
      user: obj.user // 这样相当于把一个对象赋值给变量，复制的是内存地址，两个变量指向的是同一个内存地址
    }
    // 浅拷贝的方式复制对象，对象潜套的对象会被直接复制内存地址
    hd.user.name = "湘军";
    //console.log(JSON.stringify(obj,null,2));
    /*{
          "name": "后盾人",
            "user": {
            "name": "湘军"
            }  
     */
    // console.log(JSON.stringify(hd,));
    /*
      {
        "name": "后盾人",
        "user": {
        "name": "湘军"
      }     
       */

    // 深层拷贝的方法就是要层层拷贝
    //深拷贝方法1: 
    // 递归遍历， 层层拷贝
    let data = {
      name: '后盾人',
      user: {
        name: 'hdcms'
      },
      arr: []
    };
    function copy(obj) {
      // 使用typeof 判断对象 返回的是对象 {}，因此想复制数组需要使用instanceof
      let res = obj instanceof Array?[]:{};
      /*for(let key in object){
        //属性是对象，递归调用copy函数
        res[key] = typeof object[key] == 'object'? copy(object[key]): object[key];
      }*/
      // 使用 Object.entries()可以获取对象和数组的key，value格式，所以深copy适合使用这个方法取数据
      for(const [k,v] of Object.entries(obj)){
        res[k]= typeof v == 'object' ? copy(v) : v;
      }
      return res;
    } 
    hd = copy(data);
    hd.user.name = "湘军";
    hd.arr.push('abc');
    console.log(JSON.stringify(data,null,2));
    /**  {
          "name": "后盾人",
          "user": {
          "name": "hdcms"
           },
          "arr": []  
         }*/
    console.log(JSON.stringify(hd,null,2));
      /**  {
            "name": "后盾人",
            "user": {
            "name": "湘军"
            },
            "arr": [
               "abc"
            ]
           }*/
  </script>
</body>

</html>